<%@ Control Language="C#" AutoEventWireup="true" CodeFile="MyAppointmentForm.ascx.cs"
    Inherits="Templates_MyAppointmentForm" %>
<%@ Register Assembly="DevExpress.Web.ASPxEditors.v9.2, Version=9.2.6.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dxe" %>
<%@ Register Assembly="DevExpress.Web.ASPxScheduler.v9.2, Version=9.2.6.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web.ASPxScheduler.Controls" TagPrefix="dxsc" %>
<%@ Register Assembly="DevExpress.Web.ASPxScheduler.v9.2, Version=9.2.6.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web.ASPxScheduler" TagPrefix="dxwschs" %>
<table cellpadding="0" cellspacing="0" style="width: 100%; height: 285px;">
    <tr>
        <td colspan="4" style="width: 100%">
            <dxe:ASPxLabel ID="lblDemoShortDescription" runat="server" Text="Fill in the fields according to instructions provided."></dxe:ASPxLabel>
            <br />
            <dxe:ASPxLabel ID="lblDemoLongDescription" runat="server" Text="The Subject field is required and cannot be left blank. Enter the Price value as a positive decimal that conforms to the pattern ##0.00, e.g. 15.60. Make sure that the End date does not come before the Start date."></dxe:ASPxLabel>
            <br />
            <br />
        </td>
    </tr>
    <tr>
        <td style="width: 57px; padding-right: 5px;">
            <dxe:ASPxLabel ID="lblSubject" runat="server" Text="Subject:" AssociatedControlID="tbSubject">
            </dxe:ASPxLabel>
        </td>
        <td colspan="3" style="width: 100%">
            <dxe:ASPxTextBox ID="tbSubject" runat="server" Width="100%" Text='<%# ((MyAppointmentFormTemplateContainer)Container).Appointment.Subject %>'>
                <ValidationSettings ErrorDisplayMode="ImageWithTooltip">
                    <RequiredField ErrorText="The Subject must contain at least one character." IsRequired="True" />
                </ValidationSettings>
                <ClientSideEvents ValueChanged="function(s, e) { OnUpdateControlValue(s, e); }" />
            </dxe:ASPxTextBox>
        </td>
    </tr>
    <tr>
        <td style="padding-right: 5px;">
            <dxe:ASPxLabel ID="lblLocation" runat="server" Text="Location:" AssociatedControlID="tbLocation">
            </dxe:ASPxLabel>
        </td>
        <td style="width: 50%">
            <dxe:ASPxTextBox ID="tbLocation" Width="100%" runat="server" Text='<%#((MyAppointmentFormTemplateContainer)Container).Appointment.Location %>'>
            </dxe:ASPxTextBox>
        </td>
        <td style="padding-left: 10px; padding-right: 5px;">
            <dxe:ASPxLabel ID="lblLabel" runat="server" Text="Price:" AssociatedControlID="tbPrice">
            </dxe:ASPxLabel>
        </td>
        <td style="width: 50%">
            <dxe:ASPxTextBox ID="tbPrice" Width="100%" runat="server" Text='<%# ((MyAppointmentFormTemplateContainer)Container).Price %>'>
                <ValidationSettings ErrorDisplayMode="ImageWithTooltip">
                    <RegularExpression ErrorText="Enter the Price value as a positive decimal." ValidationExpression="(^(\d*)\.(\d*)$)|(^\d*$)" />
                    <RequiredField ErrorText="The field cannot be blank." IsRequired="True" />
                </ValidationSettings>
                <ClientSideEvents ValueChanged="function(s, e) { OnUpdateControlValue(s, e); }"
                    Validation="function(s, e) { OnPriceValidate(s, e); }" />
            </dxe:ASPxTextBox>
        </td>
    </tr>
    <tr>
        <td style="white-space: nowrap; padding-right: 5px;">
            <dxe:ASPxLabel ID="lblStartTime" runat="server" Text="Start time:" AssociatedControlID="edtStartDate">
            </dxe:ASPxLabel>
        </td>
        <td colspan="3">
            <dxe:ASPxDateEdit ID="edtStartDate" runat="server" Date='<%# ((MyAppointmentFormTemplateContainer)Container).Start %>'
                Width="100%" EditFormat="DateTime" ClientInstanceName="edtStartTimeAppointmentForm">
                <ValidationSettings ErrorDisplayMode="ImageWithTooltip" EnableCustomValidation="True"
                    ValidationGroup="DateValidatoinGroup">
                    <RequiredField ErrorText="The field cannot be blank." IsRequired="True" />
                </ValidationSettings>
                <ClientSideEvents Validation="function(s, e) { OnStartTimeValidate(s, e); }" 
                    ValueChanged="function(s, e) {	OnUpdateControlValue(s, e); }" />
            </dxe:ASPxDateEdit>
        </td>
    </tr>
    <tr>
        <td style="white-space: nowrap; padding-right: 5px;">
            <dxe:ASPxLabel ID="lblEndTime" runat="server" Text="End time:" AssociatedControlID="edtEndDate">
            </dxe:ASPxLabel>
        </td>
        <td colspan="3">
            <dxe:ASPxDateEdit ID="edtEndDate" runat="server" Date='<%# ((MyAppointmentFormTemplateContainer)Container).End %>'
                Width="100%" EditFormat="DateTime" ClientInstanceName="edtEndTimeAppointmentForm">
                <ClientSideEvents Validation="function(s, e) {	OnEndTimeValidate(s, e); }" 
                    ValueChanged="function(s, e) { OnUpdateControlValue(s, e); }" />
                <ValidationSettings EnableCustomValidation="True" ErrorDisplayMode="ImageWithTooltip"
                    ValidationGroup="DateValidatoinGroup">
                    <RequiredField ErrorText="Cannot be empty" IsRequired="True" />
                </ValidationSettings>
            </dxe:ASPxDateEdit>
        </td>
    </tr>
    <tr>
        <td colspan="4">
            <dxe:ASPxLabel ID="lblDescription" runat="server" Text="Description:" AssociatedControlID="memDescription">
            </dxe:ASPxLabel>
        </td>
    </tr>
    <tr>
        <td colspan="4">
            <dxe:ASPxMemo ID="memDescription" runat="server" Rows="2" Text='<%#((MyAppointmentFormTemplateContainer)Container).Appointment.Description %>'
                Width="100%">
            </dxe:ASPxMemo>
        </td>
    </tr>
    <tr>
        <td colspan="4">
            <dxe:ASPxLabel ID="lblContactInfo" runat="server" Text="Contact information:" AssociatedControlID="memContacts">
            </dxe:ASPxLabel>
        </td>
    </tr>
    <tr>
        <td colspan="4">
            <dxe:ASPxMemo ID="memContacts" runat="server" Rows="3" Text='<%#((MyAppointmentFormTemplateContainer)Container).ContactInfo %>'
                Width="100%">
            </dxe:ASPxMemo>
    </tr>
</table>
<dxsc:AppointmentRecurrenceForm ID="AppointmentRecurrenceForm1" runat="server" IsRecurring='<%# ((AppointmentFormTemplateContainer)Container).Appointment.IsRecurring %>'
    DayNumber='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceDayNumber %>'
    End='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceEnd %>' Month='<%# ((AppointmentFormTemplateContainer)Container).RecurrenceMonth %>'
    OccurrenceCount='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceOccurrenceCount %>'
    Periodicity='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrencePeriodicity %>'
    RecurrenceRange='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceRange %>'
    Start='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceStart %>'
    WeekDays='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceWeekDays %>'
    WeekOfMonth='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceWeekOfMonth %>'
    RecurrenceType='<%# ((MyAppointmentFormTemplateContainer)Container).RecurrenceType %>'
    IsFormRecreated='<%# ((MyAppointmentFormTemplateContainer)Container).IsFormRecreated %>'>
</dxsc:AppointmentRecurrenceForm>
<table cellpadding="0" cellspacing="0" style="width: 100%; height: 35px;">
    <tr>
        <td style="width: 100%; height: 100%;" align="center">
            <table style="height: 100%;">
                <tr>
                    <td>
                        <dxe:ASPxButton runat="server" ID="btnOk" Text="OK" UseSubmitBehavior="False" AutoPostBack="False"
                            ClientInstanceName="btnMyAppointmentFormOk" EnableViewState="False" Width="91px"
                            ValidationGroup="MyValidationGroup">
                            <ClientSideEvents Init="function(s, e) { OnUpdateControlValue(s, e); }" />
                        </dxe:ASPxButton>
                    </td>
                    <td>
                        <dxe:ASPxButton runat="server" ID="btnCancel" Text="Cancel" UseSubmitBehavior="false"
                            AutoPostBack="false" EnableViewState="false" Width="91px" />
                    </td>
                    <td>
                        <dxe:ASPxButton runat="server" ID="btnDelete" Text="Delete" UseSubmitBehavior="false"
                            AutoPostBack="false" EnableViewState="false" Width="91px"
                            Enabled='<%# ((DevExpress.Web.ASPxScheduler.AppointmentFormTemplateContainer)Container).CanDeleteAppointment %>' />
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
<table cellpadding="0" cellspacing="0" style="width: 100%;">
    <tr>
        <td style="width: 100%;" align="left">
            <dxsc:ASPxSchedulerStatusInfo runat="server" ID="schedulerStatusInfo" Priority="1"
                MasterControlId='<%# ((DevExpress.Web.ASPxScheduler.AppointmentFormTemplateContainer)Container).ControlId %>' />
        </td>
    </tr>
</table>
<script id="dxss_myAppoinmentForm007" type="text/javascript">
    function OnPriceValidate(s, e) {
        if (e.isValid) {
            var value = parseFloat(e.value);
            if (value > 1000000) {
                e.isValid = false;
                e.errorText = "The Price field value is too high.";
            }
        }
    }
    function OnStartTimeValidate(s, e) {
        if (!e.isValid)
            return;
        var startDate = edtStartTimeAppointmentForm.GetDate();
        var endDate = edtEndTimeAppointmentForm.GetDate();
        e.isValid = startDate == null || endDate == null || startDate < endDate;    
        e.errorText = "The Start Date must precede the End Date.";
    }
    function OnEndTimeValidate(s, e) {
        if (!e.isValid)
            return;
        var startDate = edtStartTimeAppointmentForm.GetDate();
        var endDate = edtEndTimeAppointmentForm.GetDate();
        e.isValid = startDate == null || endDate == null || startDate < endDate ;    
        e.errorText = "The Start Date must precede the End Date.";
    }
    function OnUpdateControlValue(s, e) {
        var isValid = ASPxClientEdit.ValidateEditorsInContainer(null);
        btnMyAppointmentFormOk.SetEnabled(isValid)
    }
    window.setTimeout("ASPxClientEdit.ValidateEditorsInContainer(null)", 0);
</script>
